<template>
	<div class="ProcessMaintenanceManagement">
		<div class="cont">
			<div class="tables-l">
				<div class="title">
					已扫描
				</div>
				<div class="info">
					<el-form>
						<el-row :gutter="10">
							<el-col :span="6">
								<el-form-item label="产品条码:">
									<el-input v-model="selectData.le.fBarCode"></el-input>
								</el-form-item>
							</el-col>
							<el-col :span="6">
								<el-form-item label="制作时间:">
									<el-date-picker
										v-model="selectData.le.fMakeTime"
										type="date"
									  />
								</el-form-item>
							</el-col>
							<el-col :span="6">
								<el-form-item label="工序编号:">
									<el-input v-model="selectData.le.fScaPro"></el-input>
								</el-form-item>
							</el-col>
							<el-col :span="6">
								<el-form-item label="操 作 员: ">
									<el-input v-model="selectData.le.fOperator"></el-input>
								</el-form-item>
							</el-col>
							<el-col :span="6">
								<el-form-item label="物料条码:">
									<el-input v-model="selectData.le.fInvBarCode"></el-input>
								</el-form-item>
							</el-col>
							<el-col :span="6">
								<el-form-item label="物料编号: ">
									<el-input v-model="selectData.le.fInvCode"></el-input>
								</el-form-item>
							</el-col>
							<el-col :span="6">
								<el-form-item label="状态:">
									<el-select v-model="selectData.le.fProState" class="m-2"  size="large">
									  <el-option
									    v-for="item in [{label:'拆机',value:'-1'},{label:'正常',value:'1'},{label:'全部',value:''}]"
										:key="item.value"
										:label="item.label"
										:value="item.value"
									  />
									</el-select>
								</el-form-item>
							</el-col>
							<el-col :span="3">
								<el-button  size="large" plain @click="clearSelect(true)">清空</el-button>
							</el-col>
							<el-col :span="3">
								<el-button type="primary" size="large" plain @click="cx(true)">查询</el-button>
							</el-col>
						</el-row>
					</el-form>
					<el-table :data="table.le" border style="width: 100%" v-loading="loding.le">
						<el-table-column align="center" label="序号" #default="scope" width="80" :show-overflow-tooltip="true">
							{{scope.$index+1}}
						</el-table-column>
						<el-table-column align="center" prop="fBarCode" label="产品编码"  min-width="120" :show-overflow-tooltip="true"/>
						<el-table-column align="center" prop="fScaPro" label="工序编号" min-width="120" :show-overflow-tooltip="true" />
						<el-table-column align="center" prop="fProName" label="工序名称" min-width="120" :show-overflow-tooltip="true" />
						<el-table-column align="center" prop="fOperator" label="操作员" min-width="120" :show-overflow-tooltip="true" />
						<el-table-column align="center" prop="fInvCode" label="品号" min-width="120" :show-overflow-tooltip="true" />
						<el-table-column align="center" prop="fInvBarCode" label="物料条码"  min-width="120" :show-overflow-tooltip="true" />
						<el-table-column align="center" prop="fMakeTime" label="制作时间" min-width="120" :show-overflow-tooltip="true" />
						<el-table-column align="center" label="状态" #default="scope" width="180" :show-overflow-tooltip="true">
							{{(scope.row.fProState==1)?'正常':'拆机'}}
						</el-table-column>
						<el-table-column align="center" label="操作" #default="scope" width="180" fixed="right" :show-overflow-tooltip="true">
							<el-button type="danger" @click="del(true,scope)">删除</el-button>
						</el-table-column>
					</el-table>
					<el-row :gutter="10">
						<el-col :span="24">
						  <el-pagination style="margin-top: 20px" layout="total, sizes, prev, pager, next, jumper"
							:page-size="selectData.le.size" :total="sumPage.le" :current-page="selectData.le.page"
							@current-change="(ev)=>{pageSelect(true,ev)}" @size-change="(ev)=>{pageSizeSelect(true,ev)}">
						  </el-pagination>
						</el-col>
					</el-row>
				</div>
			</div>
			<div class="tables-r">
				<div class="title">
					未扫描
				</div>
				<div class="info">
					<el-form>
						<el-row :gutter="10">
							<el-col :span="6">
								<el-form-item label="产品编号:">
									<el-input v-model="selectData.rit.fBarCode"></el-input>
								</el-form-item>
							</el-col>
							<el-col :span="6">
								<el-form-item label="品号:">
									<el-input v-model="selectData.rit.fInvCode"></el-input>
								</el-form-item>
							</el-col>
							<el-col :span="6">
								<el-form-item label="工序编号:">
									<el-input v-model="selectData.rit.fScaPro"></el-input>
								</el-form-item>
							</el-col>
							<el-col :span="3">
								<el-button  size="large" plain @click="clearSelect(false)">清空</el-button>
							</el-col>
							<el-col :span="3">
								<el-button type="primary" size="large" plain @click="cx(false)">查询</el-button>
							</el-col>
						</el-row>
					</el-form>
					<el-table :data="table.rit" border style="width: 100%" v-loading="loding.rit">
						<el-table-column align="center" label="序号" #default="scope" width="80" :show-overflow-tooltip="true">
							{{scope.$index+1}}
						</el-table-column>
						<el-table-column align="center" prop="fBarCode" label="产品编号"  min-width="120" :show-overflow-tooltip="true" />
						<el-table-column align="center" prop="fSort" label="产品序号"  min-width="120" :show-overflow-tooltip="true" />
						<el-table-column align="center" prop="fInvCode" label="品号" min-width="120" :show-overflow-tooltip="true" />
						<el-table-column align="center" prop="fInvName" label="存货名称" min-width="120" :show-overflow-tooltip="true" />
						<el-table-column align="center" prop="fInvStd" label="规格型号" min-width="120" :show-overflow-tooltip="true" />
						<el-table-column align="center" prop="fRequireQty" label="需扫描数" min-width="120" :show-overflow-tooltip="true" />
						<el-table-column align="center" prop="fAlreadyQty" label="已扫描数"  min-width="120" :show-overflow-tooltip="true"/>
						<el-table-column align="center" prop="fScaPro" label="工序编号" min-width="120" :show-overflow-tooltip="true" />
						<el-table-column align="center" prop="fProName" label="工序名称" min-width="120" :show-overflow-tooltip="true" />
						<el-table-column align="center" label="操作" #default="scope" width="180" fixed="right" :show-overflow-tooltip="true">
							<el-button type="danger" @click="del(false,scope)">删除</el-button>
						</el-table-column>
					</el-table>
					<el-row :gutter="10">
						<el-col :span="24">
						  <el-pagination style="margin-top: 20px" layout="total, sizes, prev, pager, next, jumper"
							:page-size="selectData.rit.size" :total="sumPage.rit" :current-page="selectData.rit.page"
							@current-change="(ev)=>{pageSelect(false,ev)}" @size-change="(ev)=>{pageSizeSelect(false,ev)}">
						  </el-pagination>
						</el-col>
					</el-row>
				</div>
			</div>
		</div>
	</div>
</template>

<script setup>
	import { ref,reactive,onMounted } from 'vue'
	import { ElMessage,ElMessageBox } from 'element-plus'
	import ajax from '../../../../public/JavaScript/api/ajax.js'
	let form=reactive({
		tm:'',
		dj:'',
		select:{
		  "endTime": "",
		  "fBarCode": "",
		  "fCCode": "",
		  "fProductName": "",
		  "fclnvCode": "",
		  "fclnvStd": "",
		  "page": 1,
		  "size": 10,
		  "startTime": "",
		  "sumPage":0,
		  "acceptState":"",
		  "insType":""
		}
	})
	let loding=reactive({
		le:false,
		rit:false
	})
	let table=reactive({
		le:[],
		rit:[]
	})
	let sumPage=reactive({
		le:0,
		rit:0
	})
	let selectData=reactive({
		le:{
			  "fBarCode": "",
			  "fInvBarCode": "",
			  "fInvCode": "",
			  "fMakeTime": "",
			  "fOperator": "",
			  "fProState": "",
			  "fScaPro": "",
			  "page": 1,
			  "size": 10
		},
		rit:{
			  "fBarCode": "",
			  "fInvCode": "",
			  "fScaPro": "",
			  "page": 1,
			  "size": 10
		}
	})
	function cx(type){
		if(type){
			loding.le=true
			table.le=[]
			ajax.post('/pcpc/sal',{
				body:selectData.le
			},res=>{
				console.log(res)
				if(res.code==200){
					table.le=res.data?.list || []
					sumPage.le=res.data?.totalCount || 0
					ElMessage.success('查询成功')
				}else{
					ElMessage.error(res.msg)
				}
				loding.le=false
			},err=>{
				ElMessage.error('服务异常')
				loding.le=false
			})
		}else{
			loding.rit=true
			table.rit=[]
			ajax.post('/pcpc/swl',{
				body:selectData.rit
			},res=>{
				console.log(res)
				if(res.code==200){
					table.rit=res.data?.list || []
					sumPage.rit=res.data?.totalCount || 0
					ElMessage.success('查询成功')
				}else{
					ElMessage.error(res.msg)
				}
				loding.rit=false
			},err=>{
				ElMessage.error('服务异常')
				loding.rit=false
			})
		}
	}
	function del(type,ev){
		ElMessageBox.confirm(
		  '是否确认删除?',
		  '警告',
		  {
			confirmButtonText: '是',
			cancelButtonText: '否',
			type: 'error',
		  }
		).then(()=>{
			if(type){
				ajax.post('/pcpc/da',{
					body:ev.row
				},res=>{
					if(res.code==200 && res.data>0){
						ElMessage.success('删除成功')
						table.le.splice(ev.$index,1)
						sumPage.le-=1
					}else{
						ElMessage.error(res.msg || '删除失败')
					}
				},err=>{
					ElMessage.error('服务异常')
				})
			}else{
				ajax.post('/pcpc/dw',{
					body:ev.row
				},res=>{
					if(res.code==200 && res.data>0){
						ElMessage.success('删除成功')
						table.rit.splice(ev.$index,1)
						sumPage.rit-=1
					}else{
						ElMessage.error(res.msg || '删除失败')
					}
				},err=>{
					ElMessage.error('服务异常')
				})
			}
		})
	}
	function clearSelect(type){
		if(type){
			selectData.le={
				...(selectData.le),
			  "fBarCode": "",
			  "fInvBarCode": "",
			  "fInvCode": "",
			  "fMakeTime": "",
			  "fOperator": "",
			  "fProState": "",
			  "fScaPro": ""
			}
		}else{
			selectData.rit={
				...(selectData.rit),
			  "fBarCode": "",
			  "fInvCode": "",
			  "fScaPro": ""
			}
		}
	}
	function pageSelect(type,ev){
		if(type){
			selectData.le.page=ev
			cx(true)
		}else{
			selectData.rit.page=ev
			cx(false)
		}
	}
	function pageSizeSelect(type,ev){
		if(type){
			selectData.le.size=ev
			cx(true)
		}else{
			selectData.rit.size=ev
			cx(false)
		}
	}
	/* 深拷贝 */
	function sCOPY(start,end){
		for(let i in end){
			start[i]=JSON.parse(JSON.stringify(end[i]))
		}
	}
	/* 对象赋空 */
	function clearObj(obj){
		for(let i in obj){
			obj[i]=''
		}
	}
	onMounted(()=>{

	})
</script>

<style lang="less" scoped>
	@import url('./ProcessMaintenanceManagement.less');
</style>